<template>
    <v-chart class="chart" :option="option" />
</template>

<script setup>
import { use } from 'echarts/core';
import { CanvasRenderer } from 'echarts/renderers';
import { PieChart } from 'echarts/charts';
import {
    TitleComponent,
    TooltipComponent,
    LegendComponent,
} from 'echarts/components';
import VChart, { THEME_KEY } from 'vue-echarts';
import { ref, provide } from 'vue';

use([
    CanvasRenderer,
    PieChart,
    TitleComponent,
    TooltipComponent,
    LegendComponent,
]);

provide(THEME_KEY, 'dark');

const option = ref({
    baseOption: {
        timeline: {
            axisType: 'category',
            show: true,
            autoPlay: false,
            playInterval: 2000,
            data: ['1月', '2月', '3月']
        },
        grid: { containLable: true },
        xAxis: {},
        yAxis: { type: 'value', name: '亿元' },
        series: [
            {
                type: 'line',
            },],
        tooltip: {}

    },
    options: [
        {
            title: {},
            series: {}
        },
        {
            title: {},
            series: {}
        },
        {
            title: {},
            series: {}
        },
    ]
})
</script>

<style scoped>
.chart {
    height: 400px;
}
</style>